import { TableObject } from "@/type/global";
import { Button, Col, Row } from "antd";

const TableCard: React.FC<{ data: TableObject, onImport: (data: TableObject) => void, onDelete: (id: string | number) => void }> = (props) => {

    return <div style={{ border: '1px solid rgb(240,240,240)', padding: '10px 20px', marginBottom: '8px' }}>
        <Row>
            <Col span={18}>{props.data.tableComment || '暂无名称'}</Col>
            <Col span={3}><Button size="small" type="primary" onClick={() => props.onImport(props.data)}>导入</Button></Col>
            <Col span={3}><Button size="small" onClick={() => props.onDelete(props.data.id!)}>删除</Button></Col>
        </Row>

        <Row style={{ color: '#a6a6a6' }}>
            <Col span={12}><span>表名:</span> {props.data.tableName}</Col>
            <Col span={12}><span>表注释:</span> {props.data.tableComment}</Col>
            <Col style={{ marginTop: '4px' }} span={24}><span>列名:</span> {props.data.fieldList?.map(item => item.fieldName).join(',')}</Col>
        </Row>
    </div>
}

export default TableCard;